﻿<!DOCTYPE HTML>
<html>
<head>
<!-- META TAGS -->
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- STYLES -->
<link href="css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href="css/fullpage.css" rel="stylesheet" type="text/css">
<link href="css/style.css" rel="stylesheet" type="text/css">
<link href="css/custom.css" rel="stylesheet" type="text/css">
<!-- SITE TITLE -->
<title>To Joan</title>
</head>
<body>

<!-- AUDIO PLAYER -->
<audio class="audio-player" autoplay loop>
	<source src="audio/Firefry.mp3" type="audio/mpeg">
</audio>

<!-- BACKGROUND CONTAINER -->
<div class="bg-container snowy">
	<!-- GLASS BALL -->
	<div class="glass-ball rotate"></div>
	<!-- TOP LIGHT -->
	<div class="top-light"></div>
	<!-- PAGE CONTENT -->
	<div class="page-content">
		<div class="fullpage">
			<!-- HOME SECTION -->
			<div id="home" class="section active">
				<!-- TITLE -->
				<h1 class="snow-text">Merry Christmas</h1>
				<!-- COUNTER -->
				<div class="snow-box">
					<div class="countdown" data-date="December 25 2018 00:00:00"></div>
				</div>
			</div>
			<!-- INFO SECTION -->
			<div id="info" class="section">
				<div class="container">
					<!-- INFO TEXT -->
					<div class="shadow-box">
						<h2>To Joan</h2>
						<p>mmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmm</p>
					</div>
					<!-- SOCIAL ICONS -->
					<ul class="social-icons">
						<li><a href="#" title="Facebook"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
						<li><a href="#" title="Twitter"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
						<li><a href="#" title="Google+"><i class="fa fa-google-plus" aria-hidden="true"></i></a></li>
						<li><a href="#" title="Contact"><i class="fa fa-envelope" aria-hidden="true"></i></a></li>
					</ul>
				</div>
			</div>
			<!-- CONTACT SECTION -->
			<div id="contact" class="section">
				<div class="container">
					<!-- CONTACT TEXT -->
					<div class="shadow-box">
						<h3>Contact</h3>
						<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas feugiat hendrerit mauris, non porta lectus varius sed. Sed maximus faucibus ullamcorper. Etiam eu varius purus, ac hendrerit orci.</p>
					</div>
					<!-- CONTACT FORM -->
					<div class="contact">
						<div id="contact-result">
							<!-- CONTACT RESULT HOLDER -->
						</div>
						<form class="contact-form ajax-form" name="contact" action="contacts.php" method="POST" data-result="#contact-result">
							<div class="form-group">
								<input name="name" type="text" class="form-control" value="" placeholder="Name">
							</div>
							<div class="form-group">
								<input name="email" type="text" class="form-control" value="" placeholder="Email">
							</div>
							<div class="form-group">
								<textarea name="message" class="form-control" placeholder="Message"></textarea>
							</div>
							<div class="form-group">
								<input name="submit" class="btn-submit" type="submit" value="Send Mail">
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<!-- SCRIPTS  -->
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/countdown.min.js"></script>
<script type="text/javascript" src="js/jquery.fullpage.min.js"></script>
<script type="text/javascript" src="js/three.canvas.js"></script>
<script type="text/javascript" src="js/snowy.js"></script>
<script type="text/javascript" src="js/script.js"></script>
<script type="text/javascript" src="js/custom.js"></script>

</body>
</html>
